<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>bootstrap-table表格客户端分页</title>

	<link rel="stylesheet" href="css/bootstrap.css" />
	<link rel="stylesheet" href="css/bootstrap-table.css" />
	
	<script src="js/jquery.min.js"></script>
	<script src="js/bootstrap.js"></script>
	<script src="js/bootstrap-table.js"></script>
	<script src="js/bootstrap-table-export.js"></script>
	<script src="js/jquery.base64.js"></script>
	<script src="js/tableExport.js"></script>
	<link rel="stylesheet" href="css/bootstrap.min.css" />
	<script src="/static/login/js/simpleAlert.js"></script>

	<link rel="stylesheet" href="http://localhost:8080/static/login/css/simpleAlert.css">
	<style>
		/* ===================================弹框css部分 start by:songfayuan========================================= */
		.black_overlay{
			display: none;
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: black;
			z-index:1001;
			-moz-opacity: 0.8;
			opacity:.50;
			filter: alpha(opacity=50);
		}
		.white_content {
			display: none;
			position: absolute;
			top: 15%;
			left: 36%;
			width: 33%;
			border: 2px solid #d3d3d3;
			background-color: white;
			z-index: 1002;
			/* overflow: auto; */
		}
		.white_content_small {
			display: none;
			position: absolute;
			top: 10%;
			left: 30%;
			width: 40%;
			height: 50%;
			border: 16px solid lightblue;
			background-color: white;
			z-index:1002;
			overflow: auto;
		}
		/* ===================================弹框css部分 end by:songfayuan========================================= */
	</style>

</head>

<body >
	<div id="reportTableDiv" >
		<table id="reportTable"></table>
	</div>
<!--	<a class="button border-green button-little" onclick="javasrcipt:ShowDiv('MyDiv','fade')" >新增二级分类</a>-->
	<!--弹出层时背景层DIV---start-->
	<div id="fade" class="black_overlay"></div>
	<div id="MyDiv" class="white_content">
		<div style="text-align: right; cursor: default; margin-top:10px;margin-bottom:10px;">
			<span style="font-size: 16px; margin-right: 17px; color: #56BE2D; font-weight: 600;cursor:pointer;"  onclick="CloseDiv('MyDiv','fade')">关闭</span>
		</div>
		<div class="itempanel" style="    margin-left: 13%;">

			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">座位&nbsp;ID：<input type="text" id="label" name="label"  disabled="disabled"/></div>
			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">房间&nbsp; 号：<input type="text" id="label1" name="label1" disabled="disabled" /></div>
			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">一卡&nbsp; 通：<input type="text" id="label7" name="label7" disabled="disabled"/></div>
			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">&nbsp;状&nbsp;&nbsp;态 ：<input type="text" id="label2" name="label2" disabled="disabled" /></div>
			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">管理 员：<input type="text" id="label3" name="label3" disabled="disabled"/></div>
			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">选定时间：<input type="text" id="label4" name="label4" disabled="disabled"/></div>
			<div class="floatleft editor" style="font-size:16px;height: 24px;line-height: 24px;">结束时间：<input type="text" id="label5" name="label5" disabled="disabled"/></div>


				<div class="floatleft message"></div>
			<div class="clear"></div>
		</div>
		<HR style="FILTER: alpha(opacity=100,finishopacity=0,style=3); margin-top: 39px;" width="90%" color=#ddd SIZE=2>
		<div style="margin-bottom: 23px; margin-top: 23px; margin-left: 23%;">
			<input type="button" class="greenbutton2" style="width:63px;margin-left: 30px;" onclick="javasrcipt:goToAdd()" value="添加" style="width: 123px; margin-left: 20%; ">
			<input type="button" class="greenbutton2" style="width:63px;margin-left: 30px;" onclick="CloseDiv('MyDiv','fade')" value="取消" style="width: 123px; margin-left: 20%; ">
		</div>
	</div>
	<!--弹出层时背景层DIV---end-->

	<script>
        function ShowDiv(show_div,bg_div){
            var scrollHeight = document.body.scrollHeight; //文档高度
            document.getElementById(bg_div).style.height=scrollHeight+'px';

            document.getElementById(show_div).style.display='block';
            document.getElementById(bg_div).style.display='block';
        };
        //关闭弹出层
        function CloseDiv(show_div,bg_div)
        {
            document.getElementById("label").value = '';
            document.getElementById(show_div).style.display='none';
            document.getElementById(bg_div).style.display='none';
        };
        //关闭弹出层
        function CloseDiv2()
        {
            document.getElementById("MyDiv").style.display='none';
            document.getElementById("fade").style.display='none';
        };
        //===================================弹框js部分 end by:songfayuan=========================================
	</script>



	<script type="text/javascript">

/*
	//手动制造30条数据
    $(document).ready(function () {


    });
*/

	$(function () {
        var datas  = [];
        alert("ninhao");
        $.ajax({
            type: "post",
            url: "http://localhost:8080/admin/bathOrder",
            dataType: "json",
            success: function(data,statusTxt,xhr){
                alert("进来");
                alert(JSON.stringify(data[0].bathId));
                var i;
               /* for(i in data){
                    alert(data[0].bathId.toString());
                    datas[i]={"bathId":data.bathId,"bathRoom":data.bathRoom,
                        "bathStatus":data.bathStatus,"bathUserCardno":data.bathUserCardno,
                        "bathAdmin":data.bathAdmin,"selectStartTime":data.selectStartTime.toString(),
                        "selectEndTime":data.selectEndTime.toString(),"createTime":data.createTime.toString(),
                    }
                }*/
                jQuery.each(data, function(i,item){

                    datas[i]={"bathId":item.bathId,"bathRoom":item.bathRoom,
                        "bathStatus":item.bathStatus,"bathUserCardno":item.bathUserCardno,
                        "bathAdmin":item.bathAdmin,"selectStartTime":item.selectStartTime.toString(),
                        "selectEndTime":item.selectEndTime.toString(),"createTime":item.createTime.toString(),
                    }
                });
                init();
            },
            error:function(xhr,textStatus){
                alert("也进来");
                console.log('错误');
                console.log(xhr);
                console.log(textStatus);
            },
            complete:function(){
                console.log('结束');
            }
        });

		function init() {
            $('#reportTable').bootstrapTable({
                method: 'get',
                cache: false,
                height: 550,
                editable:true,
                sortOrder: "asc", //排序方式
                striped: true,
                pagination: true,
                pageSize: 8,
                pageNumber:1,
                pageList: [5, 10, 20, 30, 50, 100],
                search: true,
                showColumns: true,
                showRefresh: false,
                showExport: false,
                exportTypes: ['csv','txt','xml'],
                search: true,
                clickToSelect: true,
                sidePagination: "client",           //分页方式：client客户端分页，server服务端分页（*）
                uniqueId: "id", //每一行的唯一标识，一般为主键列

                columns:
                    [
                        /*{field:"checked",checkbox:true},*/
                        {field:"bathId",title:"澡位id",align:"center",valign:"middle",sortable:"true"},
                        {field:"bathRoom",title:"房间号",align:"center",valign:"middle",sortable:"true"},
                        {field:"bathStatus",title:"状态",align:"center",valign:"middle",sortable:"true"},
                        {field:"bathUserCardno",title:"一卡通",align:"center",valign:"middle",sortable:"true"},
                        {field:"bathAdmin",title:"管理员",align:"center",valign:"middle",sortable:"true"},
                        {field:"selectStartTime",title:"选取时间",align:"center",valign:"middle",sortable:"true"},
                        {field:"selectEndTime",title:"结束时间",align:"center",valign:"middle",sortable:"true"},
                        {field:"createTime",title:"创建时间",align:"center",valign:"middle",sortable:"true"},
                        {
                            title: '操作',
                            field: 'id',
                            align: 'center',
                            formatter:function(value,row,index){

                                var e = '<button href="#" class="btn btn-default" mce_href="#" onclick="eidt1(\''+ row.id + '\')">编辑</button> ';
                              /*  var d = '<button href="#" class="btn btn-default" mce_href="#" onclick="del(\''+ row.id +'\')">删除</button> ';*/
                                return e;
                            }
                        }

                    ],
                data:datas,
            });
        }


	});

function eidt1(ids) {

    $('#reportTable tr').click(function () {
        console.info( $(this).children('td').eq(0).html());
       var bathId= $(this).children('td').eq(0).html()
       /* var dblChoseAlert = simpleAlert({
            "content":"编辑",
            "buttons":{
                "确定":function () {

                    dblChoseAlert.close();
                }
            }
        })*/
        $.ajax({
            /*?userName="+name+"&"+"passwd="+pass*/
            type: "post",
            url: "http://localhost:8080/admin/byBathId",
            data: {"bathId":bathId},

            /*        data: {"userName":$("#signin-username1").val(), "passwd":$("#signin-password1").val()},*/
            dataType: "json",

            success: function(data,statusTxt,xhr){
                ShowDiv('MyDiv','fade');
                alert(data.bathId);
                $("#label").val(data.bathId);
                $("#label1").val(data.bathRoom);
                $("#label7").val(data.bathUserCardno);
                $("#label2").val(data.bathStatus);
                $("#label3").val(data.bathAdmin);
                $("#label4").val(data.selectStartTime);
                $("#label5").val(data.selectEndTime);


             /*   if(statusTxt == "success"){
                    alert("1111111");
                    var userData = eval(data);
                    if(userData.code=="F_000000"){

                        var dblChoseAlert = simpleAlert({
                            "content":"注册成功!",
                            "buttons":{
                                "确定":function () {
                                    dblChoseAlert.close();

                                }
                            }
                        })
                    }else{
                        if(userData.code=="F_99991"){
                            var dblChoseAlert = simpleAlert({
                                "content":"验证码错误!",
                                "buttons":{
                                    "确定":function () {

                                        dblChoseAlert.close();
                                    }
                                }
                            })
                        }else{
                            var dblChoseAlert = simpleAlert({
                                "content":"注册失败,同一卡号只能注册一次!",
                                "buttons":{
                                    "确定":function () {

                                        dblChoseAlert.close();
                                    }
                                }
                            })

                        }

                    }
                }*/

            },
            error:function(xhr,textStatus){
                var dblChoseAlert = simpleAlert({
                    "content":"注册失败!",
                    "buttons":{
                        "确定":function () {

                            dblChoseAlert.close();
                        }
                    }
                })
                console.log('错误')
                console.log(xhr)
                console.log(textStatus)
            },
            complete:function(){
                console.log('结束')
            }
        });
        $("#reportTable tr").unbind("click");
    });


};
/*
	function del(ids) {
	    alert(ids);
		alert("11111");
    };
$('#reportTable tr').click(function () {
    alert("dede");
    alert($(this).children('td').eq(0).html());
});
*/


	</script>

	
</body>
</html>
